<template>
	<view>
		<uni-table :loading="loading" :emptyText="'没有更多数据'" border stripe>
			<uni-tr>
				<uni-th align="center">提现金额</uni-th>
				<uni-th align="center">连续猜对歌曲数</uni-th>
				<uni-th align="center">看视频次数</uni-th>
				<uni-th align="center">连续签到天数</uni-th>
				<uni-th align="center">累计猜对歌曲数</uni-th>
				<uni-th width="204" align="center">操作</uni-th>
			</uni-tr>
			<uni-tr v-for="(item,index) in data" :key="index">
				<uni-td align="center"><span v-if="item.key=='index1'">新手</span><span v-if="item.key=='index2'">幸运</span>{{item.coin}}</uni-td>
				<uni-td align="center">{{item.liandui}}</uni-td>
				<uni-td align="center">{{item.video}}</uni-td>
				<uni-td align="center">{{item.qiandao}}</uni-td>
				<uni-td align="center">{{item.leijicaidui}}</uni-td>
				<uni-td align="center">
					<view class="uni-group">
						<button @click="confirmDelete(item)" class="uni-button" size="mini" type="warn">修改</button>
					</view>
				</uni-td>
			</uni-tr>
		</uni-table>
        
        <uni-popup ref="Popup" type="center">
            <view class="modal" style="width:450px; padding: 20px;">
                <view class="uni-container">
                    <uni-forms ref="form" validateTrigger="bind">
                        <uni-forms-item label="提现金额" name="title" labelWidth="100">
                            <input class="uni-input-border" type="text" placeholder="提现金额" v-model="item.coin" />
                        </uni-forms-item>
                        <uni-forms-item label="连续猜对歌曲数" name="title" labelWidth="100">
                            <input class="uni-input-border" type="text" placeholder="连续猜对歌曲数" v-model="item.liandui" />
                        </uni-forms-item>
                        
                        <uni-forms-item label="看视频次数" name="title" labelWidth="100">
                            <input class="uni-input-border" type="text" placeholder="看视频次数" v-model="item.video" />
                        </uni-forms-item>
                        
                        <uni-forms-item label="连续签到天数" name="title" labelWidth="100">
                            <input class="uni-input-border" type="text" placeholder="连续签到天数" v-model="item.qiandao" />
                        </uni-forms-item>
                        
                        <uni-forms-item label="累计猜对歌曲数" name="title" labelWidth="100">
                            <input class="uni-input-border" type="text" placeholder="累计猜对歌曲数" v-model="item.leijicaidui" />
                        </uni-forms-item>
        
                        <view class="uni-button-group pointer"><button class="uni-button uni-button-full" type="primary" :disabled="isLoading" @click="save">保存</button></view>
                    </uni-forms>
                </view>
            </view>
        </uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				loading:false,
                data:[],
                item:{},
                isLoading:false,
			}
		},
        mounted() {
            this.loadData()
        },
		methods: {
			loadData() {
				var self = this
                self.loading = true
                self.data = []
                this.$request('admin/gettixianrole',{}).then(res => {
                	this.loading = false
                	self.data = res.data.list
                	console.log(res)
                }).catch(res => {
                
                }).finally(err => {
                	this.loading = false
                })
			},
            confirmDelete(item){
                this.item = item
                this.$refs.Popup.open()
                console.log(this.item)
            },
            save(){
                var self = this
                console.log(self.item)
                self.isLoading = true
                self.$request('admin/changetixianrole',self.item).then(res => {
                	self.isLoading = false
                	uni.showToast({
                		title: "修改成功",
                		icon: 'none',
                		duration: 2000
                	})
                	this.$refs.Popup.close()
                	self.loadData()
                }).catch(res => {
                
                }).finally(err => {
                	this.isLoading = false
                })
            }
		}
	}
</script>

<style>
.modal {
    width: 100%;
    max-width: 980px;
    margin: 0 auto;
    background-color: #ffffff;
}

.modal-content {
    padding: 15px;
    height: 500px;
    box-sizing: border-box;
}

</style>
